<template>
	<view class="notice-d-box">
		<view class="notice-d-title">{{form.info.name}}</view>
		<view class="notice-d-time">
			<view class="view">{{timestamp(form.info.createTime)}}</view>
			<view class="view">{{form.info.creatorName}}</view>
		</view>
		<view>
			<!-- <rich-text class="notice-d-content" :nodes="formatRichText(form.info.content)"></rich-text> -->
			<u-parse :content="form.info.content"></u-parse>
		</view>
	</view>
</template>
<script setup lang="ts">
	import {reactive} from 'vue'
	import { onLoad } from "@dcloudio/uni-app"
	import dayjs  from "dayjs"
	
	const form = reactive({
		info: null
	})
	//处理时间戳
	const timestamp = (val:any,s) => {
		return !s ? dayjs(val).format('YYYY-MM-DD') : dayjs(val).format('YYYY-MM-DD HH:mm:ss')
	}
	onLoad((options)=>{
		if(options){
			form.info = JSON.parse(decodeURIComponent(options.info))
			console.log(form.info)
		}
	})
	
	const formatRichText = (content) =>{
		if (!content) {
		    return content;
		}
		//控制小程序中图片大小
		let newContent = content.replace(/<img[^>]*>/gi, function (match, capture) {
		    console.log(match.search(/style=/gi));
		    if (match.search(/style=/gi) === -1) {
		        match = match.replace(/\<img/gi, '<img style=""');
		    }
		    return match;
		});
		newContent = newContent.replace(/style="/gi, '$& max-width:100% !important; ');
		newContent = newContent.replace(/<br[^>]*\/>/gi, '');
		return newContent;
	}
</script>

<style lang="scss" scoped>
	.notice-d-box{
		padding: 60rpx 32rpx 60rpx 32rpx;
	}
	.notice-d-title{
		color: rgba(0, 0, 0, 1);
		font-size: 40rpx;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.notice-d-time{
		display: flex;
		justify-content: space-between;
		padding: 20rpx 0 32rpx 0;
		.view{
			color: rgba(153, 153, 153, 1);
			font-size: 32rpx;
		}
	}
	.notice-d-content{
		font-size: 32rpx;
		color: rgba(51, 51, 51, 1);
		word-break:break-word;
		width: 100%;
	}
</style>